<template>
  <div class="common" style="overflow:hidden">
    <ul>
      <li v-for="item in data" :key="item.pid">
        <img :src="item.pimg" alt />
        <p>{{item.pname}}</p>
        <p>{{item.ptitle}}</p>
      </li>
    </ul>
  </div>
</template>

<script>
import * as api from "../api/getProlist";

export default {
  name: "common",
  data() {
    return {
      data: []
    };
  },
  mounted() {
    api.getClass({ pclass: 3 }).then(data => {
      this.data = data.data.result;
    });
  }
};
</script>

<style  scoped>
/* .common{
    height:2000px;
}
.common ul{
    height:5000px;
}  */
.common ul img {
  width: 100%;
}
.common ul li p {
  text-align: left;
  margin-left: 30px;
}
.common ul li p:nth-of-type(1) {
  font-size: 40px;
  font-weight: bolder;
}
</style>